<!DOCTYPE html>
{block name="include"}{include file="head" /}{/block}
<html class="x-admin-sm">
    <body>
        <div class="layui-fluid">
            <div class="layui-row">
                <form class="layui-form form1" lay-filter="form1" id="form">
                <div class="layui-form-item">
                      <label for="username" class="layui-form-label">
                          <span class="x-red">*</span>班级名称
                      </label>
                      <div class="layui-input-inline">
                          <input type="text" id="class_name" name="class_name" required="required" lay-verify="class_name"
                          autocomplete="off" class="layui-input">
                      </div>
                      <div class="layui-form-mid layui-word-aux">

                      </div>
                  </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"><span class="x-red">*</span>班级状态</label>
                        <div class="layui-input-block">
                            <input type="radio" name="class_status"  lay-skin="primary" value="1" title="在校" lay-verify="otherReq" checked>
                            <input type="radio" name="class_status"  lay-skin="primary" value="0" title="毕业" lay-verify="otherReq">
                        </div>
                    </div>
                  <div class="layui-form-item">
                      <label for="L_repass" class="layui-form-label">
                      </label>
                      <button  class="layui-btn" lay-filter="add" lay-submit="" id="tj">
                          增加
                      </button>
                  </div>
              </form>
            </div>
        </div>
        <script>layui.use(['form','upload', 'layer'],
            function() {
                $ = layui.jquery;
                var form = layui.form,
                layer = layui.layer;
                var upload = layui.upload;

                //自定义验证规则
                form.verify({
                    class_name: function(value) {
                        if (value.length == 0) {
                            return '不能为空';
                        }
                    },

                    otherReq: function(value,item){
                        var $ = layui.$;
                        var verifyName=$(item).attr('name')
                            , verifyType=$(item).attr('type')
                            ,formElem=$(item).parents('.layui-form')//获取当前所在的form元素，如果存在的话
                            ,verifyElem=formElem.find('input[name='+verifyName+']')//获取需要校验的元素
                            ,isTrue= verifyElem.is(':checked')//是否命中校验
                            ,focusElem = verifyElem.next().find('i.layui-icon');//焦点元素
                        if(!isTrue || !value){
                            //定位焦点
                            focusElem.css(verifyType=='radio'?{"color":"#FF5722"}:{"border-color":"#FF5722"});
                            //对非输入框设置焦点
                            focusElem.first().attr("tabIndex","1").css("outline","0").blur(function() {
                                focusElem.css(verifyType=='radio'?{"color":""}:{"border-color":""});
                            }).focus();
                            return '请选择班级状态';
                        }
                    }

                });
                //监听提交
                form.on('submit(add)',
                function(data) {

                    $.ajax({
                        url: "{:url('admin/clas/create')}",
                        type:'post',
                        data:data.field,
                        success:function (callback) {
                            if (callback.msg == 200){
                                layer.msg('增加成功',{icon:6});
                                setTimeout(function () {
                                    xadmin.close();
                                    // 可以对父窗口进行刷新
                                    xadmin.father_reload();
                                },1200);
                            }else {
                                layer.msg(callback.msg, {icon: 5})
                            }

                        }
                    });
                    return false;


                });

            });








        </script>

    </body>

</html>
